﻿@model CleverCMS.Cms.Services.ViewModels.AdminEditUserViewModel

@section TitleContent
{
    @((Model != null && Model.Id != 0) ? "Update User" : "Edit User")
}

<script type="text/javascript">
    function successSave(e) {
        if (e.success) {
            $("#failureResult").hide();
            $("#successResult").show().fadeOut(5000);
        } else {
            $("#errortext").html(e.error);
            $("#failureResult").fadeIn(1000);
        }
    }
    function failureSave() {
        $("#failureResult").show().fadeIn(700);
    }

    $(document).ready(function() {
        $("button[type=submit]").on("click", function () {
            $("html, body").animate({ scrollTop: 0 }, "slow");
        });
    });
</script>

<div class="widget green">
    <div class="widget-title">
        <h4><i class="icon-reorder"></i> User</h4>
    </div> 
    <div class="widget-body" id="mydiv">
        
        <div id="failureResult" class="alert alert-block alert-error" style="display: none">
            <h4 class="alert-heading">Error!</h4>
            <p id="errortext">
            </p>
        </div>

        <div class="alert alert-block alert-success" style="display: none" id="successResult">
            <h4 class="alert-heading">Success!</h4>
            <p>
                Items was successfully saved.
            </p>
        </div>
        
        <div class="module_content">
            @using (Ajax.BeginForm("Edit", new AjaxOptions { HttpMethod = "POST", OnSuccess = "successSave", OnFailure = "failureSave" }))
            {
                @Html.HiddenFor(x => x.Id)
                @Html.HiddenFor(x => x.CreatedAt)
            
                <div class="field">
                    @Html.LabelFor(x=>x.Login)
                    <div class="data">
                        @Html.TextBoxFor(x => x.Login)   
                        @Html.ValidationMessageFor(x => x.Login)
                    </div>
                </div>
                <span class="clearfix"></span>
                <div class="field">
                    @Html.LabelFor(x=>x.DisplayName)
                    <div class="data">
                        @Html.TextBoxFor(x => x.DisplayName)   
                        @Html.ValidationMessageFor(x => x.DisplayName)
                    </div>
                </div>
                <span class="clearfix"></span>
                <div class="field">
                    @Html.LabelFor(x=>x.Email)
                    <div class="data">
                        <div class="input-icon left">
                            <i class="icon-envelope"></i>
                            @Html.TextBoxFor(x => x.Email)
                        </div>
                        @Html.ValidationMessageFor(x => x.Email)
                    </div>
                </div>
                <span class="clearfix"></span>
                <div class="field">
                    @Html.LabelFor(x=>x.Password)
                    <div class="data">
                        @Html.TextBoxFor(x => x.Password)   
                        @Html.ValidationMessageFor(x => x.Password)
                    </div>
                </div>
                <span class="clearfix"></span>
                <div class="field">
                    @Html.LabelFor(x=>x.RoleId)
                    <div class="data">
                        @Html.DropDownListFor(x => x.RoleId, new SelectList(Model.Roles, "RoleId", "RoleName"))
                        @Html.ValidationMessageFor(x => x.Roles)
                    </div>
                </div>
                <span class="clearfix"></span>
                <div>
                    <div>
                        <button type="submit" class="btn btn-success" name="save_user"><i class="icon-ok icon-white"></i> Save</button>
                        <button class="btn btn-inverse" onclick="resetFields(this); return false;"><i class="icon-refresh icon-white"></i> Reset</button>
                        <button class="btn btn-inverse" onclick="history.back()"><i class="icon-ban-circle icon-white"></i> Back</button> 
                    </div>
                </div>
            }
        </div>
    </div>
</div>

<style type="text/css">
    .module_content {
        width: 30%;
    }
     .field>label {
         float: left;
     }
    .field>.data {
        float: right;
        width: 75%;
        margin-right: 5px;
    }
    .data > input {
        width: 100%;
    }
</style>   